@datepicker-prefix: ~"w-datepicker";

// Picker Month and Year
.@{datepicker-prefix} {
  &-month, &-year {
    text-align: center;
    max-width: 100%;
    padding: 7px 0 5px 0;
    > div {
      display: inline-block;
      width: 50%;
      line-height: 22px;
      margin: 3px 0;
      > span {
        display: inline-block;
        padding: 1px 6px;
        border-radius: 3px;
        cursor: pointer;
      }
      &.selected > span {
        color: #fff;
        background-color: #2EA3F4;
      }
      > span:hover {
        background-color: lighten(#2EA3F4, 36%);
        color: #2EA3F4;
      }
      &.paging {
        color: rgba(0,0,0,0.25);
      }
    }
  }
  &-year > div {
    width: 33.333%;
  }
}